<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<%@include file="/view/main/stylesheet.jsp"%>
<script src="${baseurl}/styles/frameword/js/jquery.validate.min.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" type="text/css" href="${baseurl}/styles/frameword/css/add.css" />
<script src="${baseurl}/styles/frameword/js/validate.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
	$(function() {
		$("#close-button").click(function() {
			var index = parent.layer.getFrameIndex(window.name);
			parent.layer.close(index);
		});
		var url = "/pro-video-info/";
		var rules = {
			userMobile : {
				required : true
			},
			videoName : {
				required : true
			},
			startDate : {
				required : true
			},
			stopDate : {
				required : true
			},
			driverNum : {
				required : true
			},
			redEnvelopTotal : {
				required : true
			},
			redEnvelopMin : {
				required : true
			},
			redEnvelopMax : {
				required : true
			}
		};
		validate("form1", rules, call);
		function call(param, form) {
			if (param.videoName == "") {
				layer.msg('请填写视频名称');
				return;
			}
			if (param.videoUrl == "") {
				layer.msg('请选择视频');
				return;
			}
			if (param.videoThumUrl == "") {
				layer.msg('请选择缩略图');
				return;
			}
			param.redEnvelopTotal=parseInt(param.redEnvelopTotal*100);
			param.redEnvelopMin=parseInt(param.redEnvelopMin*100);
			param.redEnvelopMax=parseInt(param.redEnvelopMax*100);
			$.post(baseUrl + url + "add", param, function(data) {
				if (data.success) {
					window.location.href = baseUrl + '/result/success';
				} else {
					layer.msg(data.message);
				}
			});
		}
		layui.use('upload', function() {
			layui.upload({
				elem : '#cVideoThumUrl',
				url : uploadImgUrl,
				before : function(input) {
					$("#iVideoThumUrl").show();
					$("#spanVideoThumUrl").attr("href", '');
				},
				success : function(res) {
					$("#videoThumUrl").val(res.data);
					$("#iVideoThumUrl").hide();
					$("#spanVideoThumUrl").attr("href", res.data);
					$("#spanVideoThumUrl").text("预览图片");
				}
			});
			layui.upload({
				elem : '#cVideoUrl',
				url : uploadVideoUrl,
				before : function(input) {
					$("#iVideoUrl").show();
					$("#spanVideoUrl").attr("href", '');
				},
				success : function(res) {
					$("#videoUrl").val(res.data.url);
					$("#videoSize").val(res.data.size);
					$("#videoTime").val(res.data.time);
					$("#iVideoUrl").hide();
					$("#spanVideoUrl").attr("href", res.data.url);
					$("#spanVideoUrl").text("预览视频");
				}
			});
		});
	})
</script>
</head>
<body>
	<table class="table noline" style="margin-bottom: 0px;">
		<tbody>
			<tr>
				<td width="25%">
					<div class="input-group">
						<span class="input-group-addon explain">缩略图</span> <input lay-ext="jpg|png|gif|bmp|jpeg" lay-title="上传图片" id="cVideoThumUrl" type="file" name="file" class="layui-upload-file"> &nbsp;<i id="iVideoThumUrl" style="display: none;" class="layui-icon layui-anim layui-anim-rotate layui-anim-loop">&#xe63d;</i><a target="_blank" id="spanVideoThumUrl"></a>
					</div>
				</td>
				<td width="25%">
					<div class="input-group">
						<span class="input-group-addon explain">视频文件</span> <input lay-ext="mp4" lay-title="上传视频"  id="cVideoUrl" type="file" name="file" class="layui-upload-file"> &nbsp;<i id="iVideoUrl" style="display: none;" class="layui-icon layui-anim layui-anim-rotate layui-anim-loop">&#xe63d;</i><a target="_blank" id="spanVideoUrl"></a>
					</div>
				</td>
				<td width="50%">
					<div class="input-group">
						<span class="input-group-addon explain">视频名称</span> <input id="videoName" type="text" name="videoName" form="form1" class="form-control">
					</div>
				</td>
			</tr>
		</tbody>
	</table>
	<form class="bs-example bs-example-form" role="form" id="form1">
		<table class="table noline">
			<tbody>
				<tr>
					<td><input id="videoUrl" type="hidden" name="videoUrl" class="form-control">
						<input id="videoThumUrl" type="hidden" name="videoThumUrl" class="form-control">
						<input id="videoSize" type="hidden" name="videoSize" class="form-control">
						<input id="videoTime" type="hidden" name="videoTime" class="form-control">
						<div class="input-group">
							<span class="input-group-addon explain">归属用户</span> <input type="text" placeholder="直接输入用户手机号" name="userMobile" class="form-control">
						</div></td>
					<td>
						<div class="input-group">
							<span class="input-group-addon explain">广告类型</span>
							<wb:html wbCode="pro-video-advertising-type" name="type" type="select" />
						</div>
					</td>
				</tr>
				<tr>
					<td>
						<div class="input-group">
							<span class="input-group-addon explain">开始日期</span> <input type="date" name="startDate" class="form-control">
						</div>
					</td>
					<td>
						<div class="input-group">
							<span class="input-group-addon explain">结束日期</span> <input type="date" name="stopDate" class="form-control">
						</div>
					</td>
				</tr>
				<tr>
					<td>
						<div class="input-group">
							<span class="input-group-addon explain">终端数量</span> <input type="number" name="driverNum" class="form-control">
						</div>
					</td>
					<td>
						<div class="input-group">
							<span class="input-group-addon explain">红包总额</span> <input type="number" name="redEnvelopTotal" class="form-control">
						</div>
					</td>
				</tr>
				<tr>
					<td>
						<div class="input-group">
							<span class="input-group-addon explain">红包最小值</span> <input type="number" name="redEnvelopMin" value="0" class="form-control">
						</div>
					</td>
					<td>
						<div class="input-group">
							<span class="input-group-addon explain">红包最大值</span> <input type="number" name="redEnvelopMax" class="form-control">
						</div>
					</td>
				</tr>
				<tr>
					<td>
						<div class="input-group">
							<span class="input-group-addon explain">发布状态</span>
							<wb:html wbCode="pro-video-state" name="state" type="select" />
						</div>
					</td>
					<td>
						<div class="input-group">
							<span class="input-group-addon explain">区域范围</span>
							<wb:html wbCode="pro-city" name="areaScope" type="select" />
						</div>
					</td>
				</tr>
				<tr>
					<td colspan="2" style="text-align: right;">
						<div class="btn-group">
							<button type="button" class="btn btn-info" id="close-button">
								<i class="glyphicon glyphicon-remove"></i> 取消
							</button>
							<button type="submit" form="form1" class="btn btn-success">
								<i class="glyphicon glyphicon-ok"></i> 添加
							</button>
						</div>
					</td>
				</tr>
			</tbody>
		</table>
	</form>
</body>
</html>